<script setup>
import { ref } from 'vue'
import {  testService}from  '../../api/test.js'


const formModel = ref({
  routeMileage: '',
  routeName: '',
  routeStatus: '',
  routeTags: ['默认值'],
  spendTime: null,
  suitableTime: '',
  userId: null,
  alongScenicAreaVO: [],
  // scenicAreaStart: '',
  // scenicAreaEnd: '',
  alongElement: [],
  alongScenicArea: [],
  routeInfo: '',
  routeImages: [],
  routeImage: [],
  id: null,
  alongElementVO: [],
  routeElements:[],
  index:null

})
const dataList = ref([])
const isloading = ref(false)

const getRoutesList = async () => {
  isloading.value = true

  const res = await testService(formModel.value)
  console.log('res.data.data', res.data.data)
  // dataList.value = res.data.data.records
  formModel.value.routeImage=res.data.data[1].routeImage
console.log('dataList', dataList.value)
console.log('formModel.value.routeImage', res.data.data[1].routeImage)
}

getRoutesList()
</script>


<template>
<el-form>
  <el-form-item label="景区图片" prop="scenicAreaImage">
        <el-row :gutter="25">
          <el-col
            :span="10"
            v-for="(image, index) in formModel.routeImage"
            :key="index"
          >
            <img
              :src="image"
              alt="景区图片"
              style="width: 170px; height: auto; margin-right: 15px"
              @click="removeImage({raw:image})"
              cursor: pointer
            />
          </el-col>
        </el-row>

        <el-upload
          style="margin-left: 20px"
          class="avatar-uploader"
          :show-file-list="true"
          v-model:file-list="fileList"
          list-type="picture-card"
          :auto-upload="false"
          :on-change="onSelectFile"
          :on-preview="handlePictureCardPreview"
          :on-remove="handleRemove"
          action="https://jsonplaceholder.typicode.com/posts/"
          ref="upload"
          ><i class="el-icon-plus"></i>
        </el-upload>
        <el-dialog v-model:visible="dialogVisible"> </el-dialog>
      </el-form-item>
</el-form>
</template>